{% extends 'base/base.html' %}
{% block cssjs %}
    {% load static %}
    <link rel="stylesheet" href="{% static 'css/home-2.css' %}">

    <link rel="stylesheet" href="{% static 'css/index.min.css' %}">
    <script src="{% static 'js/share.js' %}"></script>
    <!--jACKY end-->
{% endblock %}
{% block content %}
    <div class="container" style="width: 100%">
      <div class="row section">
        <img src="{% static 'img/banner2.jpg' %}" class="banner-bg"><!--jACKY 2016-3-24-->
        <div class="tBanner">
          <div>
            <h1>用图表的方式，了解农业发展情况</h1>
            <p>让图表更有趣，数据更简单！</p>
            <a href="{% url 'visual' %}" class="btn btn-primary btn-lg">
              <i style="margin-right: 10px;" class="glyphicon glyphicon-send"></i>
              点击图表
            </a>
          </div>
        </div>
      </div>

    </div>
    <div class="container-wrap clearfix" id="particles-js">

        <!--section-group-->
        <div class="section-group pi-section-group clearfix">
            <div class="section-group-inner">

                <!--section-titlebar-->
                <div class="section-titlebar">
                    <h3>农业统计数据资源</h3>
                    <p>只为让你快速了解农业发展现状+</p>
                </div>
                <!--/section-titlebar-->
                <!--section-container-->
                <div class="section-container">

                    <ul class="pi-list">
                        <li class="pi-list-item">
                            <div class="pi-list-box">
                                <img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/i-pic-1.gif" class="pi-list-img">
                                <h4 class="pi-list-title">农业统计年鉴数据</h4>
                                <p class="pi-list-int">反映我国国情国力的基本统计指标，全面、深入展示中国经济最新发展态势。</p>
                            </div>
                        </li>
                        <li class="pi-list-item">
                            <div class="pi-list-box">
                                <img alt="农业有害生物数据" src="http://cdn.wemorefun.com/content/statics/images/i-pic-2.gif" class="pi-list-img">
                                <h4 class="pi-list-title">农业有害生物数据</h4>
                                <p class="pi-list-int">反映我国国情国力的基本统计指标，全面、深入展示中国经济最新发展态势。</p>
                            </div>
                        </li>
                        <li class="pi-list-item">
                            <div class="pi-list-box">
                                <img alt="农产品价格数据库" src="http://cdn.wemorefun.com/content/statics/images/i-pic-3.gif" class="pi-list-img">
                                <h4 class="pi-list-title">农产品价格数据库</h4>
                                <p class="pi-list-int">反映我国国情国力的基本统计指标，全面、深入展示中国经济最新发展态势。</p>
                            </div>
                        </li>
                    </ul>

                </div>
                <!--/section-container-->

            </div>
        </div>
        <!--/section-group-->

        <div class="section-group template-section-group clearfix">
                <div class="section-group-inner">

                    <!--section-titlebar-->
                    <div class="section-titlebar">
                        <h3>可视分析图表</h3>
                        <p>交互体验 加载动画 只需轻点 即刻享有 </p>
                    </div>
                    <!--/section-titlebar-->
                    <!--section-container-->
                    <div class="section-container">

                        <div class="template-group">
                            <a href="javascript:void(0);" class="template-page prev"></a>
                            <a href="javascript:void(0);" class="template-page next"></a>
                            <div class="template-list">
                                <div class="template-list-inner">
                                    <ul class="template-list-group">
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-1.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-2.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-3.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-4.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-5.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-6.jpg" /></a></li>
                                    </ul>
                                    <ul class="template-list-group">
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-7.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-8.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-9.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-10.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-11.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-12.jpg" /></a></li>
                                    </ul>
                                    <ul class="template-list-group">
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-13.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-14.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-15.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-16.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-17.jpg" /></a></li>
                                        <li class="template-list-item"><a href="/resource" title="农业统计年鉴数据" target="_blank"><img alt="农业统计年鉴数据" src="http://cdn.wemorefun.com/content/statics/images/template/b-18.jpg" /></a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>

                        <a href="/visual" class="template-btn" target="_blank">查看更多分析图</a>

                    </div>
                    <!--/section-container-->

                </div>
            </div>
            <!--/section-group-->

    </div>


{% endblock %}

{% block foot %}

    <script src="{% static 'js/index.js' %}"></script>

    <script src="{% static 'js/jquery.slider.min.js' %}"></script>
    <script src="{% static 'js/jquery.fixed.js' %}"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $(".header-wrap").hover(function () { jQuery(this).find(".prev,.next").stop(true, true).fadeTo("show", 0.6) }, function () { jQuery(this).find(".prev,.next").fadeOut() });
            $(".header-wrap").slide({ titCell: ".header-slide-num li", mainCell: ".header-slide-list", effect: "fold", autoPlay: true, interTime: 8000 });
            $(".template-group").slide({ titCell: ".template-page-group ul", mainCell: ".template-list .template-list-inner", effect: "leftLoop", autoPlay: false, vis: 3 });
            $(".desktop-group-inner").slide({ mainCell: ".desktop-list-group", effect: "leftLoop", autoPlay: true, interTime: 8000 });
            $(".consumer-group").slide({ titCell: ".consumer-num", mainCell: ".consumer-list", autoPage: true, effect: "left", autoPlay: true, vis: 3, scroll: 3, interTime: 5000 });

            $('.news-list .news-list-item:nth-child(odd)').css("margin-left", "0");
            $(window).scroll(function () {
                if ($(window).scrollTop() > 10) {
                    $('.header-nav-wrap').addClass("sticky");
                } else {
                    $('.header-nav-wrap').removeClass("sticky");
                }
            });

            $(".totop").click(function (e) {
                $('body,html').animate({ scrollTop: '0px' }, 800);
                e.stopPropagation();
            });
        });


        function closealert() {
            $(".banner-alert").remove();
        }
    </script>


{% endblock %}
